<template>
	<view class="update-center">
		<view v-if="name == '手机'" class="login-form">
			<uni-forms label-position="top" ref="form" :modelValue="form" >
				<uni-forms-item label="手机号码:">
				<!-- <uni-easyinput type="text"  class="login-box-input" placeholder="手机号码" v-model.trim="form.phone"/> -->
					<uni-easyinput  v-model="form.phone" placeholder="手机号码" />
				</uni-forms-item>
			</uni-forms>
			<button @click="submit">保存</button>
		</view>
		<view v-else-if="name == '出生日期'" class="login-form">
			<uni-forms label-position="top" ref="form" :modelValue="form">
				<uni-forms-item label="出生日期:">
					<!-- <uni-dateformat :date="form.birthDay" /> -->
					<uni-easyinput  v-model="form.birthDay" placeholder="出生日期" />
					</uni-forms-item>
			</uni-forms>
			<button @click="submit">保存</button>
		</view>
		<view v-else-if="name == '年龄'" class="login-form">
			<uni-forms label-position="top" ref="form" :modelValue="form">
				<uni-forms-item label="年龄:">
					<!-- <uni-dateformat :date="form.birthDay" /> -->
					<uni-easyinput  v-model="form.age" placeholder="年龄" />
				</uni-forms-item>
			</uni-forms>
			<button @click="submit">保存</button>
		</view>
		<view v-else-if="name == '性别'" class="login-form">
			<uni-forms label-position="top" ref="form" :modelValue="form">
				<uni-forms-item label="性别:">
					<radio-group @change="radioChange">
						<label style="margin-right: 40rpx;"  class="radio"><radio value="1" :checked="form.sex == 1" />男</label>
						<label class="radio"><radio value="2"  :checked="form.sex == 2"/>女</label>
					</radio-group>
				</uni-forms-item>
			</uni-forms>
			<button @click="submit">保存</button>
		</view>
		<view v-else-if="name == '姓名'" class="login-form">
			<uni-forms label-position="top" ref="form" :modelValue="form">
				<uni-forms-item label="姓名:">
					<uni-easyinput  v-model="form.realName" placeholder="姓名" />
				</uni-forms-item>
			</uni-forms>
			<button @click="submit">保存</button>
		</view>
		<view v-else-if="name == '班级'" class="login-form">
			<uni-forms label-position="top" ref="formClass" :modelValue="formClass">
				<uni-forms-item label="班级口令:">
					<uni-easyinput  v-model="formClass.joinUrl" placeholder="班级口令" />
				</uni-forms-item>
			</uni-forms>
			<button @click="add">保存</button>
		</view>
	</view>
</template>

<script>
export default{
	data(){
		return {
			name : "" ,//操作选项
			userinfo: {},
			form: {
				birthDay: null,
				phone: null,
				realName: null,
				sex: null,
				age: null
			},
			formClass:{
				joinUrl: null
			}
		}
	},
	onLoad(options){
		//获取token
		let token = uni.getStorageSync("token");
		console.log(!token);
		if( !token){
			// uni.showToast({
			// 	title: "请先登录！！"
			// })
			uni.redirectTo ({
				url: "/pages/login/login"
			});
		}
		let {name} = options;
		this.name = name;
		this.getUserinfo();
	},
	
	onBackPress(){
		console.log("触发返回按钮");
		// console.log(this.form.sex);
		// let pages = uni.;
		//触发上一页监听器
		var pages = getCurrentPages();
		var page =  pages[pages.length - 2];
		page.$vm.reFresh = Math.random();//触发上一页监听器
		// uni.navigateBack()//返回上一页
		
	},
	methods:{
		//加入班级
		async add(){
			const resp = await this.$myRequest({
				url: "/api/student/classes/join",
				method: "PUT",
				data: this.formClass
			})
			uni.showToast({
				title: resp.data.message
			})
			
		},
		async submit(){
			const resp = await this.$myRequest({
				url: "/api/student/user/update",
				method: "PUT",
				data: this.form
			})
			if(resp.data.code == 200){
				this.getUserinfo();//刷新数据
				
			}
			uni.showToast({
				title: resp.data.message
			})
		},
		async getUserinfo(){
			const resp = await this.$myRequest({url:"/login/info"});
			if(resp) {
				let form= {
					birthDay: this.dateFormat(resp.data.birthDay),
					phone: resp.data.phone,
					realName: resp.data.realName,
					sex: resp.data.sex,
					age: resp.data.age
				}
				this.form = form;
			}
		},
		radioChange(e){
			console.log(e.target.value);
			this.form.sex = e.target.value;
		},
		//日期格式化
		dateFormat(originVal){
		  const dt = new Date(originVal)
		  
		  const y = dt.getFullYear()
		  const m = (dt.getMonth() + 1 + '').padStart(2,'0')
		  const d = (dt.getDate() + '').padStart(2,'0')
		
		  const hh = (dt.getHours() + '').padStart(2,'0')
		  const mm = (dt.getMinutes() + '').padStart(2,'0')
		  const ss = (dt.getSeconds() + '').padStart(2,'0')
		
		  return `${y}-${m}-${d}`
		}
	}
}
</script>

<style lang="scss" scoped>
.update-center{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	width:100%;
	box-sizing: border-box;
	.login-form{
		width: 92%;
		width:94%;
		margin-top: 50rpx;
		.login-box-input{
			background-color:#F8F8F8 ;
		}
		button{
			margin-top: 80rpx;
			background: #66BB6A;
		}
	}
}
</style>
